﻿<!--
//=======================================================
// Author: Jonas Follesø <jonas@follesoe.no>
// Copyright (c) 2008
//
// Licensed under the Microsoft Public License (Ms-PL)
// A copy of the license is available at 
// http://www.opensource.org/licenses/ms-pl.html
//=======================================================
-->
<UserControl 
    x:Class="Colorful.Control.SearchPanel"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"    
    xmlns:my="clr-namespace:Colorful.Control"
    xmlns:services="clr-namespace:Colorful.Control.Services"
    xmlns:converters="clr-namespace:Colorful.Control.Converters" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    d:DesignWidth="304" 
    d:DesignHeight="368"
    Background="{DynamicResource DialogBackgroundBrush}">
    
    <!--
    <UserControl.DataContext>
        <my:ColorfulViewModel />
    </UserControl.DataContext>
    -->
    
    <UserControl.Resources>        
        <ResourceDictionary>           
            <ResourceDictionary.MergedDictionaries>                                                
                <ResourceDictionary Source="ExpressionTheme.xaml" />
                <ResourceDictionary Source="Icons.xaml" />
            </ResourceDictionary.MergedDictionaries>  
            
            <converters:ColorToBrushConverter x:Key="colorConverter" />
            <converters:BoolToVisibilityCollapsedConverter x:Key="visibilityConverter" />
            <converters:MaxStringLengthConverter x:Key="maxStringLengthConverter" AddEllipsis="True" />
            <converters:IntRangeToVisibilityConverter x:Key="intRangeVisibilityConverter" />
            
            <Storyboard x:Key="OnStartProgress" AutoReverse="True" RepeatBehavior="Forever">
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.7000000" Storyboard.TargetName="RedDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M28.583001,-13.702 L0.24399973,0.19699926"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.7000000" Storyboard.TargetName="RedDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M28.583001,-13.702 L0.24399973,0.19699926"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.7000000" Storyboard.TargetName="BlueDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M0.12499887,30.995999 L0.30600044,-1.5470001"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.7000000" Storyboard.TargetName="BlueDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M0.12499887,30.995999 L0.30600044,-1.5470001"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.7000000" Storyboard.TargetName="GreenDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-28.038,-14.282998 L1.022,1.0189984"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.7000000" Storyboard.TargetName="GreenDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-28.038,-14.282998 L1.022,1.0189984"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="YellowDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M1.0559999,-30.396001 L0.05600002,1.508"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="YellowDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M1.0559999,-30.396001 L0.05600002,1.508"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="OrangeDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M16.497999,-28.155001 L-0.35099966,0.845"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="OrangeDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M16.497999,-28.155001 L-0.35099966,0.845"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="OliveDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-14.382999,-28.551001 L0.2989997,0.596"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="OliveDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-14.382999,-28.551001 L0.2989997,0.596"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="LightGreenDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-31.934998,2.3250001 L-0.07200064,0.285"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="LightGreenDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-31.934998,2.3250001 L-0.07200064,0.285"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="MagentaDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-26.546999,15.908001 L0.46999946,-0.376"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="MagentaDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-26.546999,15.908001 L0.46999946,-0.376"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="LightBlueDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-17.423999,26.517001 L0.34199964,0.248"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="LightBlueDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M-17.423999,26.517001 L0.34199964,0.248"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="DarkBlueDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M17.683999,26.517001 L0.15200035,0.395"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="DarkBlueDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M17.683999,26.517001 L0.15200035,0.395"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="PinkDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M26.097999,15.907 L0.37900052,0.064"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="PinkDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M26.097999,15.907 L0.37900052,0.064"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="DarkPurpleDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Source="X">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M30.629998,2.3280001 L-0.22899938,0.288"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingPath BeginTime="00:00:00" Duration="00:00:00.8000000" Storyboard.TargetName="DarkPurpleDot" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.Y)" Source="Y">
            		<DoubleAnimationUsingPath.PathGeometry>
            			<PathGeometry Figures="M30.629998,2.3280001 L-0.22899938,0.288"/>
            		</DoubleAnimationUsingPath.PathGeometry>
            	</DoubleAnimationUsingPath>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="RedDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="GreenDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="BlueDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="PinkDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="MagentaDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="YellowDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OrangeDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.7000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="LightGreenDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.6000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="DarkPurpleDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.6000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="DarkBlueDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.6000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="LightBlueDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.6000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="OliveDot" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
            		<SplineDoubleKeyFrame KeyTime="00:00:01.6000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="canvas" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)">
            		<SplineDoubleKeyFrame KeySpline="0.604,0,0.592,1" KeyTime="00:00:02.6000000" Value="360"/>
            	</DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="FadeInPaletteList">
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="paletteListBox" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="1"/>
            	</DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="FadeOutPaletteList">
            	<DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="paletteListBox" Storyboard.TargetProperty="(UIElement.Opacity)">
            		<SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="0.1"/>
            	</DoubleAnimationUsingKeyFrames>
            </Storyboard>                     
        </ResourceDictionary>
    </UserControl.Resources>
	
    <UserControl.Triggers>
		<EventTrigger RoutedEvent="my:SearchPanel.StartProgress">
			<BeginStoryboard Storyboard="{StaticResource FadeOutPaletteList}"/>
			<BeginStoryboard Storyboard="{StaticResource OnStartProgress}" x:Name="OnStartProgress" />
		</EventTrigger>
		<EventTrigger RoutedEvent="my:SearchPanel.StopProgress">
			<StopStoryboard BeginStoryboardName="OnStartProgress"/>			
			<BeginStoryboard Storyboard="{StaticResource FadeInPaletteList}"/>
		</EventTrigger>
	</UserControl.Triggers>   
    
    <Grid Margin="5,5,5,5">   
        
        <Grid.RowDefinitions>
    		<RowDefinition Height="56"/>
    		<RowDefinition Height="*"/>
    		<RowDefinition Height="22"/>
    	</Grid.RowDefinitions>

        <Image 
            x:Name="logo"
            Width="36" 
            Height="36"
            Source="{Binding Logo}" 
            VerticalAlignment="Top"
            HorizontalAlignment="Left"            
            ToolTip="{Binding LogoTooltip}"
            Margin="5,5,0,0"
            >
            <Image.ContextMenu>
                <ContextMenu>
                    <MenuItem x:Name="switchProvider" Header="Switch..." Click="SwitchProvider"/>
					<MenuItem x:Name="configureProxy" Header="Configure Proxy..." Command="{Binding ConfigureProxyCommand}"/>
                </ContextMenu>
            </Image.ContextMenu>
        </Image>

        <ComboBox             
			ItemsSource="{Binding Path=AvailableLists}"
			SelectedItem="{Binding Path=CurrentList, Mode=TwoWay}" 
            Height="24" 
            VerticalAlignment="Top" 
            Margin="48,0,0,0">
            <ComboBox.ItemTemplate>
                <DataTemplate DataType="{x:Type services:ColorList}">
                    <StackPanel Orientation="Horizontal" Margin="1,1,1,1">
                        <Image Width="16" Height="16" x:Name="PART_Image"/>
                        <TextBlock Text="{Binding}" x:Name="PART_Text" Margin="6,0,0,0" />
                    </StackPanel>
                    <DataTemplate.Triggers>
                        <DataTrigger Binding="{Binding}" Value="Recent">
                            <Setter TargetName="PART_Text" Property="Text" Value="Newest" />
                            <Setter TargetName="PART_Image" Property="Source" Value="{StaticResource NewestIcon}" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding}" Value="Popular">
                            <Setter TargetName="PART_Text" Property="Text" Value="Most Popular" />
                            <Setter TargetName="PART_Image" Property="Source" Value="{StaticResource MostPopularIcon}" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding}" Value="Rating">
                            <Setter TargetName="PART_Text" Property="Text" Value="Highest Rated" />
                            <Setter TargetName="PART_Image" Property="Source" Value="{StaticResource HighestRatedIcon}" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding}" Value="Random">
                            <Setter TargetName="PART_Text" Property="Text" Value="Random" />
                            <Setter TargetName="PART_Image" Property="Source" Value="{StaticResource RandomIcon}" />
                        </DataTrigger>
                        <DataTrigger Binding="{Binding}" Value="Search">
                            <Setter TargetName="PART_Text" Property="Text" Value="Search" />
                            <Setter TargetName="PART_Image" Property="Source" Value="{StaticResource SearchIcon}" />
                        </DataTrigger>
                    </DataTemplate.Triggers>
                </DataTemplate>
            </ComboBox.ItemTemplate>            
        </ComboBox>

        <TextBox 
			IsEnabled="{Binding Path=IsSearchEnabled}"
			Text="{Binding Path=SearchQuery}" 
            Margin="48,28,54,0" 
            VerticalAlignment="Top" 
            Height="20" d:IsLocked="True"/>
        
		<Button Content="Search" Command="{Binding Path=ExecuteSearchCommand}" HorizontalAlignment="Right" Margin="0,28,0,0" VerticalAlignment="Top" Height="20" Width="50" d:IsLocked="True" />

        <TextBlock Text="{Binding Path=StatusMessage}" ToolTip="{Binding Path=ErrorMessage}" Margin="5,0,0,0.872" VerticalAlignment="Bottom" FontWeight="Bold" HorizontalAlignment="Left" Grid.Row="2" Height="Auto" Foreground="#FFFFFFFF" FontSize="11" d:IsLocked="True" />

        
        <ListBox             
			IsEnabled="{Binding Path=IsEnabled}"            
			ItemsSource="{Binding Path=Palettes}" 			
			IsSynchronizedWithCurrentItem="True"
            HorizontalContentAlignment="Stretch"
			Margin="0,0,0,0" 
			Grid.Row="1"             
            x:Name="paletteListBox">
			<ListBox.ItemTemplate>
				<DataTemplate>
					<Grid x:Name="paletteTemplate" Width="Auto" Height="68" Margin="0,0,0,2">
						<Grid.RowDefinitions>
							<RowDefinition Height="19.516"/>
							<RowDefinition Height="*"/>
						</Grid.RowDefinitions>
                        <Grid VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Height="22" Grid.Row="1" Background="{x:Null}" x:Name="hiddenInfoGrid" Width="Auto">
                        	<Grid.ColumnDefinitions>
                        		<ColumnDefinition Width="*"/>
                        	</Grid.ColumnDefinitions>
                        	<Button 
                                IsEnabled="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=IsSelected}"
                                Command="{Binding Path=DataContext.ViewInBrowserCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBox}}}" CommandParameter="{Binding}"  Margin="0,0,2,1" Width="18" HorizontalAlignment="Right" Height="18" VerticalAlignment="Bottom" Grid.Column="0" ToolTip="Go to palette site">
                                <Path Fill="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=Foreground}" Stretch="Fill" Data="F1 M 9555.88,9522L 9555.88,9620.83L 9633.04,9571.1L 9555.88,9522 Z " Width="8" Height="10" Margin="2,0,0,0" />
                            </Button>
                        	<Button 
                                IsEnabled="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=IsSelected}"
                                Command="{Binding Path=DataContext.SaveAsDesignSwatchCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ListBox}}}" CommandParameter="{Binding}" HorizontalAlignment="Right" Margin="0,0,24,1" VerticalAlignment="Bottom" Height="18" Grid.Column="0" Width="18" ToolTip="Save as Expression Design Swatch Library">
                                <Path 
                                    Fill="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=Foreground}"
                                    Stretch="Fill" 
                                    Data="F1 M 9876.41,9474.98L 9789.18,9552.15L 9700.83,9474.98L 9762.17,9474.98L 9762.17,9458.75L 9816.3,9458.75L 9816.3,9474.98L 9876.41,9474.98 Z M 9724.13,9442.74L 9703.75,9442.74L 9703.75,9422.36L 9724.13,9422.36L 9724.13,9442.74 Z M 9761.02,9442.74L 9740.65,9442.74L 9740.65,9422.36L 9761.02,9422.36L 9761.02,9442.74 Z M 9799.64,9442.74L 9779.26,9442.74L 9779.26,9422.36L 9799.64,9422.36L 9799.64,9442.74 Z M 9840.39,9442.74L 9820.01,9442.74L 9820.01,9422.36L 9840.39,9422.36L 9840.39,9442.74 Z M 9876.43,9442.74L 9856.05,9442.74L 9856.05,9422.36L 9876.43,9422.36L 9876.43,9442.74 Z " 
                                    Width="12" 
                                    Height="9" 
                                    RenderTransformOrigin="0.5,0.5" 
                                    Margin="0,1,0,0" />
                            </Button>
                        	<Button                          
                                Command="Copy"
                                CommandParameter="{Binding}" 
                                IsEnabled="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=IsSelected}"                                                                
                                HorizontalAlignment="Right" Margin="0,0,46,1" VerticalAlignment="Bottom" Width="18" Height="18" Grid.Column="0" ToolTip="Copy Swatches">
                                <Path Fill="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Button}}, Path=Foreground}" Stretch="Fill" Data="F1 M 9131.25,9493.03L 9148.07,9493.2L 9139.11,9520.91L 9184.18,9521.14L 9193.29,9493.03L 9210,9493.09L 9200.94,9521.23L 9225.77,9521.36L 9225.52,9537.37L 9195.79,9537.21L 9181.92,9580.26L 9206.75,9580.4L 9207,9596.41L 9176.77,9596.23L 9168.25,9622.67L 9151.46,9622.18L 9159.9,9596.12L 9114.88,9595.85L 9106.21,9622.67L 9089.67,9622.18L 9098.18,9595.75L 9073.86,9595.6L 9073.93,9579.62L 9103.32,9579.79L 9117.16,9536.79L 9093.23,9536.67L 9093.34,9520.67L 9122.31,9520.82L 9131.25,9493.03 Z M 9120.04,9579.89L 9165.07,9580.16L 9179.01,9537.12L 9133.95,9536.88L 9120.04,9579.89 Z " Width="11" Height="11" />
                            </Button>
                            
							<StackPanel Orientation="Horizontal" Margin="0,0,0,0" HorizontalAlignment="Left">
                        		<TextBlock Text="{Binding Path=Author, StringFormat=by \{0\}, Converter={StaticResource maxStringLengthConverter}, ConverterParameter=21}" HorizontalAlignment="Left" TextWrapping="Wrap" d:LayoutOverrides="Height" Width="Auto" VerticalAlignment="Center" Margin="0,0,0,0" FontSize="10"/>
                        		<Path Stretch="Fill" Width="1" Height="14" Data="M80,4 L80,20" Margin="5,0,5,0">
                        			<Path.Stroke>
                        				<SolidColorBrush Color="{StaticResource ButtonDefaultTextColor}"/>
                        			</Path.Stroke>
                        		</Path>
                        		<TextBlock Text="{Binding Path=Downloads}" HorizontalAlignment="Left" Width="Auto" TextWrapping="Wrap" d:LayoutOverrides="Width" VerticalAlignment="Center" Margin="0,0,0,0" FontSize="10"/>
                                <Path Width="8" Height="8" Stretch="Fill" Data="F1 M 10105,9521.55C 10096.3,9521.56 10088.9,9527.2 10086.2,9535.04L 10093.8,9530L 10099.1,9536.73L 10079.4,9549.83L 10067.3,9528.96L 10074.8,9524.78L 10078.4,9531.45C 10082.5,9520.69 10092.8,9513.02 10105,9513.01C 10120.7,9513.02 10133.4,9525.75 10133.4,9541.44C 10133.4,9557.15 10120.7,9569.83 10105,9569.83C 10102.7,9569.83 10100.8,9567.92 10100.8,9565.56C 10100.8,9563.21 10102.7,9561.3 10105,9561.3C 10116,9561.29 10124.9,9552.42 10124.9,9541.44C 10124.9,9530.46 10116,9521.57 10105,9521.55 Z" Margin="3,1,0,0">
                                    <Path.Fill>
                                        <LinearGradientBrush StartPoint="0.411912,0.00352391" EndPoint="1.31532,0.00352391">
                                            <LinearGradientBrush.RelativeTransform>
                                                <TransformGroup>
                                                    <SkewTransform CenterX="0.411912" CenterY="0.00352391" AngleX="7.33488" AngleY="0"/>
                                                    <RotateTransform CenterX="0.411912" CenterY="0.00352391" Angle="64.57"/>
                                                </TransformGroup>
                                            </LinearGradientBrush.RelativeTransform>
                                            <LinearGradientBrush.GradientStops>
                                                <GradientStop Color="#FFE9E9E9" Offset="0"/>
                                                <GradientStop Color="#FF858587" Offset="1"/>
                                            </LinearGradientBrush.GradientStops>
                                        </LinearGradientBrush>
                                    </Path.Fill>
                                </Path>
                                <Path Visibility="Hidden" Stretch="Fill" Width="1" Height="14" Data="M80,4 L80,20" Margin="5,0,5,0">
                                	<Path.Stroke>
                                		<SolidColorBrush Color="{StaticResource ButtonDefaultTextColor}"/>
                                	</Path.Stroke>
                                </Path>
                                <TextBlock Visibility="Hidden" Text="{Binding Path=CreatedAt, StringFormat=d}" HorizontalAlignment="Left" Width="Auto" TextWrapping="Wrap" VerticalAlignment="Center" FontSize="10" />
							</StackPanel>                            
                        </Grid>
						<Grid Margin="0,0,0,0" Grid.Row="1" x:Name="colorGrid" Width="Auto">
							<Grid.ColumnDefinitions>
							<ColumnDefinition Width="0.2*" />
								<ColumnDefinition Width="0.2*" />
								<ColumnDefinition Width="0.2*" />
								<ColumnDefinition Width="0.2*" />
								<ColumnDefinition Width="0.2*" />
							</Grid.ColumnDefinitions>
							<Rectangle MouseDown="OnColorMouseDown" Grid.Column="0" Height="Auto" Width="Auto" Fill="{Binding Path=Color1, Converter={StaticResource colorConverter}}" />
							<Rectangle MouseDown="OnColorMouseDown" Grid.Column="1" Height="Auto" Width="Auto" Fill="{Binding Path=Color2, Converter={StaticResource colorConverter}}" />
							<Rectangle MouseDown="OnColorMouseDown" Grid.Column="2" Height="Auto" Width="Auto" Fill="{Binding Path=Color3, Converter={StaticResource colorConverter}}" />
							<Rectangle MouseDown="OnColorMouseDown" Grid.Column="3" Height="Auto" Width="Auto" Fill="{Binding Path=Color4, Converter={StaticResource colorConverter}}" />
							<Rectangle MouseDown="OnColorMouseDown" Grid.Column="4" Height="Auto" Width="Auto" Fill="{Binding Path=Color5, Converter={StaticResource colorConverter}}" />                        
						</Grid>
						<TextBlock Margin="0,0,0,0" Text="{Binding Path=Name, Mode=Default, Converter={StaticResource maxStringLengthConverter}, ConverterParameter=25}" TextWrapping="Wrap" VerticalAlignment="Center" FontWeight="Bold" HorizontalAlignment="Left" FontSize="12"/>
						<Image Visibility="{Binding Path=Rating, Converter={StaticResource intRangeVisibilityConverter}, ConverterParameter=1}" HorizontalAlignment="Right" Margin="0,6.048,1.395,4.468" Width="9" Source="{DynamicResource HighestRatedIcon}" Height="9"/>
						<Image Visibility="{Binding Path=Rating, Converter={StaticResource intRangeVisibilityConverter}, ConverterParameter=2}" HorizontalAlignment="Right" Margin="0,6.048,10.395,4.468" Width="9" Height="9" Source="{DynamicResource HighestRatedIcon}"/>
						<Image Visibility="{Binding Path=Rating, Converter={StaticResource intRangeVisibilityConverter}, ConverterParameter=3}" HorizontalAlignment="Right" Margin="0,6.048,19.395,4.468" Width="9" Height="9" Source="{DynamicResource HighestRatedIcon}"/>
						<Image Visibility="{Binding Path=Rating, Converter={StaticResource intRangeVisibilityConverter}, ConverterParameter=4}" HorizontalAlignment="Right" Margin="0,6.048,28.395,4.468" Width="9" Height="9" Source="{DynamicResource HighestRatedIcon}"/>
					</Grid>
                    
                    <DataTemplate.Resources>
                        <Storyboard x:Key="ShowPaletteActions">
                            <ThicknessAnimation To="0,0,0,22" Duration="0:0:0.2" Storyboard.TargetName="colorGrid" Storyboard.TargetProperty="Margin" />
                            <DoubleAnimation To="1" Duration="0:0:0.5" Storyboard.TargetName="hiddenInfoGrid" Storyboard.TargetProperty="Opacity" />
                        </Storyboard>
                        <Storyboard x:Key="HidePaletteActions">
                            <ThicknessAnimation To="0,0,0,0" Duration="0:0:0.2" Storyboard.TargetName="colorGrid" Storyboard.TargetProperty="Margin" />
                            <DoubleAnimation To="0" Duration="0:0:0.3" Storyboard.TargetName="hiddenInfoGrid" Storyboard.TargetProperty="Opacity" />
                        </Storyboard>
                    </DataTemplate.Resources>
                    
                    <DataTemplate.Triggers>
                        <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=IsSelected}" Value="True">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource ShowPaletteActions}" />
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <BeginStoryboard Storyboard="{StaticResource HidePaletteActions}" />
                            </DataTrigger.ExitActions>
						</DataTrigger>
                        <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListBoxItem}}, Path=IsMouseOver}" Value="True">
                            <DataTrigger.EnterActions>
                                <BeginStoryboard Storyboard="{StaticResource ShowPaletteActions}" />
                            </DataTrigger.EnterActions>
                            <DataTrigger.ExitActions>
                                <BeginStoryboard Storyboard="{StaticResource HidePaletteActions}" />
                            </DataTrigger.ExitActions>
                        </DataTrigger>
                    </DataTemplate.Triggers>
				</DataTemplate>
			</ListBox.ItemTemplate>
		</ListBox>
        
		<Button Content="Next" Command="{Binding Path=NextPageCommand}" HorizontalAlignment="Right" Grid.Row="2" Width="60" Height="22" VerticalAlignment="Bottom" Margin="0,0,0,-3" d:IsLocked="True" />
		<Button Content="Previous" Command="{Binding Path=PreviousPageCommand}" HorizontalAlignment="Right" Margin="0,0,64,-3" d:LayoutOverrides="HorizontalAlignment" Grid.Row="2" Width="60" Height="22" VerticalAlignment="Bottom" d:IsLocked="True" />
		        
        <Canvas             
            Visibility="{Binding Path=IsBussy, Converter={StaticResource visibilityConverter}}"
            HorizontalAlignment="Center" Margin="0,0,0,0" VerticalAlignment="Center" Width="80" Height="80" Grid.Row="1" RenderTransformOrigin="0.5,0.5" x:Name="canvas">
			<Canvas.RenderTransform>
				<TransformGroup>
					<ScaleTransform ScaleX="1" ScaleY="1"/>
					<SkewTransform AngleX="0" AngleY="0"/>
					<RotateTransform Angle="0"/>
					<TranslateTransform X="0" Y="0"/>
				</TransformGroup>
			</Canvas.RenderTransform>
			<Ellipse Fill="#FFFF0000" StrokeThickness="0" Width="20" Height="20" Canvas.Left="1.361" Canvas.Top="45.007" x:Name="RedDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Height="20" Fill="#FF00FF00" StrokeThickness="0" Width="20" Canvas.Left="57.978" Canvas.Top="45.007" x:Name="GreenDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Width="20" Fill="#FF0000FF" StrokeThickness="0" Height="20" Canvas.Left="30" x:Name="BlueDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FFFF00FF" StrokeThickness="0" Width="13" Height="13" Canvas.Left="6.62" Canvas.Top="17.415" x:Name="PinkDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FF32FFFF" StrokeThickness="0" Height="13" Width="13" Canvas.Left="60.265" Canvas.Top="17.415" x:Name="MagentaDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FFFFFF00" StrokeThickness="0" Width="13" Height="13" Canvas.Left="32.358" Canvas.Top="63.69" x:Name="YellowDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FFFD9700" StrokeThickness="0" Height="8" Width="8" Canvas.Left="19.946" Canvas.Top="63.655" d:LayoutOverrides="GridBox" x:Name="OrangeDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FF00FD7F" StrokeThickness="0" Width="8" Height="8" Canvas.Left="68.153" Canvas.Top="33.496" d:LayoutOverrides="GridBox" x:Name="LightGreenDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FFF8017D" StrokeThickness="0" Width="8" Height="8" Canvas.Left="4.59" Canvas.Top="33.496" d:LayoutOverrides="GridBox" x:Name="DarkPurpleDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FF7F00FD" StrokeThickness="0" Width="8" Height="8" Canvas.Left="17.535" Canvas.Top="9.303" d:LayoutOverrides="GridBox" x:Name="DarkBlueDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FF017DF8" StrokeThickness="0" Height="8" Width="8" Canvas.Left="53.642" Canvas.Top="9.303" d:LayoutOverrides="GridBox" x:Name="LightBlueDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
			<Ellipse Fill="#FF7DF801" StrokeThickness="0" Height="8" Width="8" Canvas.Left="50.013" Canvas.Top="64.345" d:LayoutOverrides="GridBox" x:Name="OliveDot" RenderTransformOrigin="0.5,0.5">
				<Ellipse.RenderTransform>
					<TransformGroup>
						<ScaleTransform ScaleX="1" ScaleY="1"/>
						<SkewTransform AngleX="0" AngleY="0"/>
						<RotateTransform Angle="0"/>
						<TranslateTransform X="0" Y="0"/>
					</TransformGroup>
				</Ellipse.RenderTransform>
			</Ellipse>
		</Canvas>		        
	</Grid>    
</UserControl>